import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';

class ParentWidget extends StatefulWidget {
  const ParentWidget({Key? key}) : super(key: key);

  @override
  _ParentWidgetState createState() => _ParentWidgetState();
}

class _ParentWidgetState extends State<ParentWidget> {

  bool _active = false;

  void handleTapboxChanged(bool value) {
    setState(() { _active = value; });
  }

  @override
  Widget build(BuildContext context) {
    return TapboxB(active: _active, onChanged: handleTapboxChanged);
  }
}

class TapboxB extends StatelessWidget {

  final bool active;
  final ValueChanged<bool> onChanged;

  TapboxB({
    Key? key,
    required this.active,
    required this.onChanged,
  }) : super(key: key);

  void _handleTap() {
    onChanged(!active);
  }
  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: _handleTap,
      child: Container(
        child: Center(
          child: Column(
            children: [
              Text(
                active ? 'Active' : 'Inactive',
                style: TextStyle(fontSize: 32, color: Colors.white),
              )
            ],
          ),
        ),
        // width: 200,
        height: 200,
        decoration: BoxDecoration(
          color: active ? Colors.lightGreen[700] : Colors.grey[600]
        ),
      ),
    );
  }
}